<template>
  <tr>
    <th><input type="checkbox" v-model="item.checked" /></th>
    <th>{{ item.name }}</th>
    <th>{{ item.price }}</th>
    <th>
      <button @click="sub">-</button>
      {{ item.num }}
      <button @click="add">+</button>
    </th>
    <th>{{ item.num * item.price }}</th>
    <button @click="deleteFn">删除</button>
  </tr>
</template>

<script>
export default {
  props: ['index', 'item'],
  methods: {
    deleteFn() {
      this.$emit('sub',this.index)
    },
    add() {
      this.item.num++
    },
    sub() {
      this.item.num--
    },
  },
}
</script>

<style scoped>
td {
  text-align: center;
}
</style>
